<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        *{margin: 0; padding: 0;}
        #play_list{
            width: 350px;
            border: 1px solid #ccc;
            margin: 100px auto;
        }
        #play_list h2{
            font-size: 14px;
            font-weight: 400;
            height: 35px;
            line-height: 35px;
            background: #ccc url("img/ico.gif") no-repeat 320px 15px;
            padding-left: 20px;
            cursor: pointer;
            border: 1px solid #fff;
        }
        #play_list ul{
            list-style-type: none;
        }
        #play_list ul li{
            height: 30px;
            line-height: 30px;
            padding-left: 20px;
            font-size: 14px;
            background:#e9edf2;
            border-bottom: 1px solid #fff;
        }
        #play_list ul li a{
            text-decoration: none;
            color:  #6b7980;
            display: block;
        }
        #play_list .current{
            background-position:320px -10px ;
        }
    </style>
</head>
<body>
    <div id="play_list">
        <h2 id="play_title">播放列表</h2>
        <ul id="music_list">
            <li><a href="javascript:;">玩家之徒 - 蔡依林</a></li>
            <li><a href="javascript:;">原谅我就是这样的女生 - 戴佩妮</a></li>
            <li><a href="javascript:;">猜不透 - 丁当</a></li>
            <li><a href="javascript:;">自导自演 - 周杰伦</a></li>
            <li><a href="javascript:;">浪漫窝 - 弦子</a></li>
            <li><a href="javascript:;">流年 - 王菲</a></li>
        </ul>
    </div>
</body>
</html>
<script>
//获取元素
    var playTitle = document.getElementById("play_title");
    var musicList = document.getElementById("music_list");
    
    playTitle.onclick = function () {
        if(musicList.style.display == "none"){
            musicList.style.display = "block";
            this.style.backgroundPosition = "320px 15px"
        }else{
            musicList.style.display = "none";
            this.style.backgroundPosition = "320px -10px"
        }
    }

</script>